<template>
	<view >
			<view class="noticesList bg-white margin-top-1">
				<block v-for="(item,index) in stores" :key="index" wx:key="index">
					<view class="noticesList-list" @tap="_toDetail(item)">
						<view class="notices-info">
							<view class="notices-info-name">{{item.name}}</view>
							<view class="notice-bottom">
								<view>
									<text class="lg cuIcon-phone notice-startTime margin-left-xs">{{item.tel}}</text>
								</view>
							</view>
							<view class="notice-bottom">
								<view>
									<text class="lg cuIcon-time notice-startTime margin-left-xs">{{item.workTime}}</text>
								</view>
							</view>
							<view class="notice-bottom">
								<view>
									<text class="lg cuIcon-location notice-startTime margin-left-xs">{{item.site}}</text>
								</view>
							</view>
						</view>
						<view class="notices-info-image">
							<image :src="item.icon" />
						</view>
					</view>
				</block>
			</view>
		</scroll-view>
	</view>
</template>

<script>
	import {getStoreInfo} from '../../api/shop/shopApi.js'
	export default {
		data() {
			return {
				stores: [],
				mid:'',
			};
		},
		components: {
		},
		onLoad(option){
			this.vc.onLoad(option);
			this.mid = option.mid;
			this.getStoreInfos();
		},
		methods: {
			getStoreInfos: function() {
				//查询分类
				let _that = this;
				let _data = {
					convenienceMenusId:_that.mid,
					page:1,
					row:100
				}
				getStoreInfo(_data)
				.then(function(stores){
					_that.stores = stores;
				});
			},
			_toDetail: function(_item) {
				this.vc.navigateTo({
					url: '/pages/convenience/storeInfoDetail?sid=' + _item.storeInfoId
				});
			}
		}
	}
</script>

<style>
	.noticesList-list{
	  font-size: 25rpx;
	  display: flex;
	  width: 100%;
	  padding: 10rpx 0;   
	  border-bottom: 1rpx solid #ECECEC;
	  color: #6D6D6D;
	  justify-content: space-between;
	}
	.notices-info-name{
	  margin-top: 10rpx;
	  color: black;
	  font-size: 30rpx;
	  display: -webkit-box;  /*设置为弹性盒子*/
	  -webkit-line-clamp: 1;  /*最多显示5行*/
	  overflow: hidden;  /*超出隐藏*/
	  text-overflow: ellipsis;  /*超出显示为省略号*/
	  -webkit-box-orient: vertical;
	  word-break: break-all;  /*强制英文单词自动换行*/
	}
	.notices-info-image image{
	  width: 200rpx;
	  height: 150rpx;
	  margin: 35rpx 20rpx 0rpx 20rpx;
	  border-radius: 10rpx;
	}
	.notices-info{
	  margin: 10rpx 0rpx 0rpx 20rpx;
	  height: 180rpx;
	  flex-direction: column;
	  display: flex;
	  justify-content: space-between;
	}
	.notice-bottom{
	  display: flex;
	  text-align: left;
	}
	.notice-startTime{
		display: -webkit-box;
		overflow: hidden;
		text-overflow: ellipsis;
		word-wrap: break-word;
		white-space: normal !important;
		-webkit-line-clamp: 1;
		-webkit-box-orient: vertical;
	}
	.notice-bottom view{
	  margin-right: 20rpx;
	}
	
	.notice-bottom icon{
	  color: #8a8a8a;
	  display: inline-block;
	  width: 40rpx;
	  height: 40rpx;
	}
	.notice-bottom view text{
	  font-size: 25rpx;
	  line-height: 40rpx;
	}

</style>
